<template>
  <el-container>
    <el-header style="font-size:22px;color:#000;border-bottom:1px solid #ccc;">
      流程管理
    </el-header>
    <el-main>
      <el-steps :active="active" finish-status="success" style="marginBottom:60px">
      <el-step title="购书申请"></el-step>
      <el-step title="经理拾取"></el-step>
      <el-step title="经理审核"></el-step>
      <el-step title="财务拾取"></el-step>
      <el-step title="财务审核"></el-step>
      </el-steps>
      
    <router-view @submit="next"  @toFinancial="toFinancialPickUp"  style="marginLeft:20%" />
    
     
    </el-main>
  </el-container>
</template>

<script>
 export default {
    data() {
     return{
       active:0
     }
          
    },
    
    methods: {
      next() {
        if (this.active++ > 4) {
          this.active = 0;
          this.$router.push('/submitApply')
          }
        else if(this.active === 1 ){
          this.$router.push('/managerPickUp')  } 
        else if(this.active === 2){ 
          this.$router.push('/managerAudit')  
          }  
        else if( this.active === 3){
          this.$router.push('/financialPickUp')  }
       
        else if( this.active === 4){ 
          this.$router.push('/financialAudit')  
          }  
      },

      toFinancialPickUp(){
        this.active = 3
        this.$router.push('/financialPickUp')
      }
     
    }
  }
</script>

<style scoped>

</style>
